<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>数据列表</title>
    <link rel="stylesheet" type="text/css" href="../../themes/default/ui.all.css">
</head>
<body>
<div id="grid">
    <div class="grid_data">
        <div class="ui_grid_head">
            <ul>
                <li style="width: 20px;"><input class="grid_selector" type="checkbox" id="cbAll" /></li>
                <li>序号</li>
                <li>编码</li>
                <li>姓名</li>
                <li>年龄</li>
                <li>身高</li>
                <li>体重</li>
                <li>创建日期</li>
            </ul>
        </div>
        <div class="ui_grid_data">
            {{each rows as value i}}
            <ul class="row{{i%2}}">
                <li><input class="grid_selector" type="checkbox" value="{{value.Code}}" id="cb{{i}}"/></li>
                <li>{{i+1}}</li>
                <li title="{{value.Code}}">{{value.Code}}</li>
                <li title="{{value.Name}}">{{value.Name}}</li>
                <li>{{value.Age}}</li>
                <li>{{value.Height}}</li>
                <li>{{value.Weight}}</li>
                <li>{{value.CreateDate}}</li>
            </ul>
            {{/each}}
        </div>
    </div>
</div>
</body>

<script type="text/javascript" src="../../lib/jquery-1.11.0.min.js"></script>
<script type="text/javascript" src="../../lib/template.js"></script>
<script type="text/javascript" src="../../release/cetc54.ui.all.js"></script>
<script>
    $('#grid').uiGrid({
        autoFit: true,
        colFit:true,
        gridTitleFix: true,
        width:1000,
        height:200,
        showHeader:true,
        icon: 'application_view_columns',
        title: '数据列表',
        url: 'data.json'
        //url:'big_data.json'
    });
</script>
</html>
